<!DOCTYPE html
    PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" c />
    <title>无标题文档</title>
    <script src="../../ibrary/jquery.js" type="text/javascript"></script>
    <script src="../../package/all.js"></script>
    <style type="text/css">
        ul,
        li {
            margin: 0;
            padding: 0
        }

        #scrollDiv {
            width: 300px;
            height: 300px;
            line-height: 25px;
            border: #ccc 1px solid;
            overflow: hidden
        }

        #scrollDiv li {
            height: 25px;
            padding-left: 10px;
        }
    </style>
    
    
</head>

<body>
    <div id="scrollDiv">
        <ul>
            <li>百度 www.baidu.com</li>
            <li>脚本之家 www.jb51.net</li>
            <li>这是公告标题的第三行</li>
            <li>这是公告标题的第四行</li>
            <li>这是公告标题的第五行</li>
            <li>这是公告标题的第六行</li>
            <li>这是公告标题的第七行</li>
            <li>这是公告标题的第八行</li>
        </ul>
    </div>
    <script type="text/javascript">
        
        $(document).ready(function () { 
            let timeOut = null
            timeOut = setInterval(()=>AutoScroll("#scrollDiv"), 1000)
            $("#scrollDiv").hover(function () {
                clearInterval(timeOut)
            })
            $("#scrollDiv").mouseleave(function () {
                clearInterval(timeOut)
                timeOut = setInterval(()=>AutoScroll("#scrollDiv"), 1000)
            })

        }); 
    </script>
</body>

</html>